import React from 'react';
import {Button,Icon} from 'antd';
import {inject, observer} from 'mobx-react';
import {WeaTop, WeaTab, WeaRightMenu, WeaDialog, WeaLocaleProvider} from  'ecCom';
import {WeaTableNew} from 'comsMobx';
import {Condition, getAdButtons} from '../list/ListCondition';

const WeaTable = WeaTableNew.WeaTable;
const getLabel = WeaLocaleProvider.getLabel;

@inject('wfTemplateManageStore')

@observer

export default class Main extends React.Component {

    constructor(props) {
        super(props);

    }

    varTemp = {
      title: getLabel(20823,'模板管理'),
      searchType: ['base', 'advanced'],
      moreBtns: {
        datas: [],
        collectParams: {
            favname: getLabel(20823,'模板管理'),
            favouritetype: 2,
            objid: 0,
            importantlevel: 1,
        }
      },
      btn: [],
    }
    getSelectedRowKeysTail() {
        const {wfTemplateManageStore} = this.props;
        const {tableStore} = wfTemplateManageStore;
        const tableNow = tableStore;
        const selectedRowKeys = tableNow.selectedRowKeys;
        const idsJson = JSON.stringify(selectedRowKeys);
        let ids = idsJson.slice(1, idsJson.length - 1).replace(/\"/g, "");
        return ids;
    }

    handleCancel = () => {
        const {wfTemplateManageStore} = this.props;
        wfTemplateManageStore.templateManage(false);
    }

    getFooter() {
        let btns = [];
        // let ids = this.getSelectedRowKeysTail();
        btns.push(
            // (<Button type='primary' onClick={() => this.props.newTemplate()}>新建</Button>),
            // (<Button type='primary' disabled={!ids} onClick={() => this.props.deleteTemplate(ids)}>批量删除</Button>),
            (<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@3uel6q@cancel`} type='glost' onClick={this.handleCancel}>{getLabel(31129,'取消')}</Button>),
        )
        return btns;
    }

    getTitle(){
        const ids = this.getSelectedRowKeysTail();
        let btns = [];
        btns.push(
            <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@3qc5oc@add`} style={{border:'none',padding:'0px',fontSize:'20px',lineHeight:'1',color:'#55a1f8',backgroundColor:'#fff'}} type="primary" title={getLabel(611,'添加')} size="small" onClick={this.props.newTemplate}><span className="icon-coms-Add-to-hot"/></Button>,
            <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@z2siwh@cancel`} style={{border:'none',padding:'0px',fontSize:'20px',lineHeight:'1',color: !ids ? '#d8d8d8':'#55a1f8',marginRight:'10px',backgroundColor: '#fff'}} type="primary" title={getLabel(126371,'删除')} size="small" disabled={!ids} onClick={this.delete} ><span className="icon-coms-form-delete-hot"/></Button>
        )
        return btns;
    }

    delete = () => this.props.deleteTemplate(ids);
    getMoreBtns () {
        let btns = {
            datas: [],
            collectParams: {
                favname: getLabel(20823,'模板管理'),
                favouritetype: 2,
                objid: 0,
                importantlevel: 1,
            }
        };

        return btns;
    }
    hideSearchAd= () => this.props.wfTemplateManageStore.setShowSearchAd(false);
    setShowSearchAd= bool => {this.props.wfTemplateManageStore.setShowSearchAd(bool)};
    onSearchChange= v => {this.props.wfTemplateManageStore.setFormFields({name: {value: v}})};
    onSearch= v => {this.props.wfTemplateManageStore.doSearch()};
    render() {

        const {wfTemplateManageStore} = this.props;
        const {tableStore, form, showSearchAd, templateManageVisible} = wfTemplateManageStore;
        const formParams = form.getFormParams() || {};
        this.varTemp.bnts = [];
        this.varTemp.btns = this.getTitle();
        return (
            <div>
                <WeaDialog ecId={`${this && this.props && this.props.ecId || ''}_WeaDialog@4792xr`}
                    className="wf-templateManage"
                    visible={templateManageVisible}
                    title={this.varTemp.title}
                    icon="icon-coms-workflow"
                    iconBgcolor='#0079DE'
                    maskClosable={false}
                    // buttons={this.getFooter()}
                    onCancel={this.handleCancel}
                    hasScroll={false}
                    zIndex={990}
                    style={{width: '974px', height: '490px'}}
                    moreBtn={this.varTemp.moreBtns}
                >
                    <WeaRightMenu ecId={`${this && this.props && this.props.ecId || ''}_WeaRightMenu@7awc9u`}
                        {...this.getMoreBtns()}
                    >
                        <WeaTab ecId={`${this && this.props && this.props.ecId || ''}_WeaTab@u7xasv`}
                            buttonsAd={getAdButtons(wfTemplateManageStore)}
                            searchType={this.varTemp.searchType}
                            searchsBaseValue={formParams.name}
                            hideSearchAd={this.hideSearchAd}
                            showSearchAd={showSearchAd}
                            advanceHeight={170}
                            hasMask={false}
                            buttons={this.varTemp.btns}
                            setShowSearchAd={this.setShowSearchAd}
                            searchsAd={
                                <Condition ecId={`${this && this.props && this.props.ecId || ''}_Condition@lo2jn4`} listStore={wfTemplateManageStore}/>
                            }
                            onSearchChange={this.onSearchChange}
                            onSearch={this.onSearch}
                        />
                        <WeaTable ecId={`${this && this.props && this.props.ecId || ''}_WeaTable@9dyl3o`}
                            comsWeaTableStore={tableStore}
                            hasOrder={true}
                            needScroll={true}
                        />
                    </WeaRightMenu>
                </WeaDialog>
            </div>
        )
    }
}